<template>
  <!-- 删除 -->
  <el-dialog v-model="dialogVisible" title="Tips">
    <span>是否确认删除</span>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="dialogVisible = false">取消</el-button>
        <el-button type="primary" @click="del(school_id)">确定删除</el-button>
      </span>
    </template>
  </el-dialog>

  <!-- 修改 -->
  <el-drawer v-model="drawer" :direction="direction">
    <template #header>
      <h4>修改信息</h4>
    </template>
    <el-form v-model="one_school_list">
      <el-form-item label="学校名称">
          <el-input v-model="one_school_list.school_name"></el-input>
      </el-form-item>
        <el-form-item>
          <el-button type="default" @click="update(one_school_list.id)"></el-button>
      </el-form-item>
    </el-form>
  </el-drawer>

  <el-table :data="school_list">
    <el-table-column label="学校名称" prop="school_name"></el-table-column>
    <el-table-column label="操作">
      <template #default="proce">
        <el-button type="default" @click="dia_del(proce.row.id)"
          >删除</el-button
        >
        <el-button type="default" @click="draw(proce.row.id)">编辑</el-button
        ><br />
        <el-button type="default">查看当前学校下的所有班级</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import {
  get_all_school,
  get_one_school,
  post_school,
  put_school,
  del_school,
} from "@/utils/api";
import {
  get_all_user,
  get_one_user,
  post_user,
  put_user,
  del_user,
} from "@/utils/api";
import { ref } from "vue";
import { ElMessageBox } from "element-plus";
export default {
  name: "school",
  data() {
    return {
      school_list: [],
      user_list: [],
      one_school_list: {},
      school_name: null,

      dialogVisible: ref(false),
      
      school_id: null,
      
      drawer: ref(false),
      direction: "rtl",
    };
  },
  mounted() {
    get_all_school()
      .then((resp) => {
          if(resp.data.code == 200){
            console.log("获取全部学校信息成功", resp);
            this.school_list = resp.data.data;
          }else{
            console.log("获取全部学校信息失败", err);
          }
      })
      .catch((err) => {
        console.log("获取全部学校信息失败", err);
      });
  },
  methods: {
    dia_del(id) {
      this.dialogVisible = true;
      this.school_id = id;
      console.log("接受的参数", id);
    },
    del(id) {
      console.log("接受的参数", id);
      del_school(id)
        .then((resp) => {
          if (resp.data.code == 200) {
            console.log("删除成功", resp);
            alert(resp.data.msg);
          } else {
            console.log("删除失败", resp);
            alert(resp.data.msg);
          }
        })
        .catch((err) => {
          console.log("删除失败", err);
        });
    },
    draw(id) {
      get_one_school(id)      .then((resp) => {
          if(resp.data.code == 200){
            console.log("获取单个学校信息成功", resp);
            this.one_school_list = resp.data.data;
          }else{
            console.log("获取单个学校信息失败", resp);
            alert(resp.data.msg)
          }
      })
      .catch((err) => {
        console.log("获取单个学校信息", err);
      });
      this.drawer = true;
    },
    update(id){
        
    }
  },
};
</script>

<style>
</style>